import React from 'react';
import {Button, message, Tabs} from 'antd';
import {inject, observer} from 'mobx-react';
import {WeaDialog, WeaFormItem, WeaInput, WeaLocaleProvider, WeaTextarea} from 'ecCom';
import ProgramTarget from '../programView/ProgramTarget'
import {WeaTableNew} from "comsMobx";
import * as Util from "../../../util/Util";

const toJS = mobx.toJS;
const getLabel = WeaLocaleProvider.getLabel;
const TabPane = Tabs.TabPane;
const WeaTable = WeaTableNew.WeaTable;

/**
 * 绩效-考核方案-考核项
 * jiansong 2020/2/11
 */
@inject("programItemStore")
@observer
export default class ProgramItem extends React.Component {

    constructor(props) {
        super(props);
        this.store = this.props.programItemStore;
    }

    componentWillMount() {
        //获取当前用户可以查看的指标列表
        this.store.getProgramAccessItemList();
    }
    componentWillReceiveProps(newProps){
        //this.store.getProgramAccessItemList();
    }
    clickDialog(){
        const {onClick} = this.props;
        if(typeof onClick === "function"){
            onClick('','',2);
        }
    }
    render() {
        let {showStatus, form: {id, name, description, assessDetailData}, operation, onFormChange, accessItemList} = this.store;
        const {showItem} = this.props;
        return <div>
            {showItem && <WeaDialog ecId={`${this && this.props && this.props.ecId || ''}_WeaDialog@87lznn`}
                icon='icon-coms-implement'
                iconBgcolor='rgb(150, 53, 138)'
                style={{width: window.innerWidth * 0.7, height: window.innerHeight * 0.5}}
                title={getLabel('517033','指标模板设置') }
                buttons={this.getButtons(this.props.ecId || '')}
                hasScroll
                visible={showItem}
                onCancel={() => this.clickDialog()}
            >
                <div style={{margin: 20}}>
                    <WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@gpd3nn`}
                        label={getLabel('33439', '名称')}
                        labelCol={{span: 3}}
                        wrapperCol={{span: 21}}
                        style={{"marginBottom": "10px"}}
                    >
                        <WeaInput ecId={`${this && this.props && this.props.ecId || ''}_WeaInput@sqbb65`}
                            value={name}
                            onChange={val => onFormChange({"name": val})}
                            viewAttr={showStatus ? 3 : 1}
                        />
                    </WeaFormItem>
                    <WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@jb8e74`}
                        label={getLabel('433', '描述')}
                        labelCol={{span: 3}}
                        wrapperCol={{span: 21}}
                        style={{"marginBottom": "10px"}}
                    >
                        <WeaTextarea ecId={`${this && this.props && this.props.ecId || ''}_WeaTextarea@3xki7p`}
                            viewAttr={showStatus ? 2 : 1}
                            value={description}
                            onChange={val => onFormChange({"description": val})}
                        />
                    </WeaFormItem>
                    <ProgramTarget ecId={`${this && this.props && this.props.ecId || ''}_ProgramTarget@hgzxmy`}
                        detailList={assessDetailData}
                        checkDisabledTarget={false}
                        onDataChange={val => onFormChange({assessDetailData: val})}
                        accessItemList={accessItemList}
                        showStatus={showStatus}
                        showTitle={true}
                    />
                </div>
            </WeaDialog>
            }
        </div>
    }

    //获取操作按钮
    getButtons = (ecId) => {
        const {onClick} = this.props;
        let {operation, showStatus} = this.store;
        if (!showStatus) {
            return []
        }
        return [
            <Button ecId={`${ecId}_Button@lw2l3c@save`} type="primary" onClick={() => {
                if (this.checkFormParams()) {
                    operation(onClick);
                }
            }}>{getLabel(86, '保存')}</Button>,
            <Button ecId={`${ecId}_Button@d4xvuw@close`} type="ghost" onClick={() => this.clickDialog()}>{getLabel('309', '关闭')}</Button>
        ]
    }

    //校验表单参数
    checkFormParams = () => {
        let {form: {name, assessDetailData}, accessItemList} = this.store;
        if (name == undefined || name == ""||name.trim()=="") {
            message.warning(getLabel('125692','名称不能为空') );
            return false;
        }
        if (assessDetailData.some(item => item.accessitemid == undefined || item.accessitemid == '')) {
            message.warning(getLabel('509123', '指标类型不能为空！'));
            return false;
        }

        if (assessDetailData.some(item => {
            let ass = accessItemList.find(accessItem => accessItem.key == item.accessitemid);
            item.itemtype = ass.itemtype;
            if (ass.itemtype == '2' && (item.target == undefined || item.target === '')) {
                return true;
            } else {
                return false
            }
        })) {
            message.warning(getLabel('509124', '定量指标需填写目标值！'));
            return false;
        }

        if (100 != assessDetailData.reduce((sum, item) => sum + Number(item.rate), 0)) {
            message.warning(getLabel('509125', '考核项权重设置不正确,权重总和需等于100！'));
            return false;
        }

        if (assessDetailData.some(i =>
            assessDetailData.some(j => i.id != j.id && i.accessitemid == j.accessitemid && i.description === j.description)
        )) {
            message.warning(getLabel('509126', '相同指标类型的指标描述不能相同！'));
            return false;
        }
        return true;
    }

};